<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<html lang="zh-CN">
<head>
<!-- 必须的 meta 标签 -->
<meta charset="utf-8">
<meta name="viewport"
	content="width=device-width, initial-scale=1, shrink-to-fit=no">

<!-- Bootstrap 的 CSS 文件 -->
<link rel="stylesheet" href="css/bootstrap.min.css" />

<title>Hello, world!</title>
</head>
<body>
	<div style="display: none">
		<table>
			<tr>
				<th scope="row"><img src="img/jidanchang.jpg" height="60px"
					width="80px" /></th>
				<td>鸡蛋肠</td>
				<td>5.0</td>
				<td><img src="img/minu.png" class="down" /> <span>1</span> <img
					src="img/add.png" class="up" /></td>

				<td class="dj">￥5.00</td>
				<td>
					<button type="button" class="btn btn-primary d">删除</button>
				</td>
			</tr>
		</table>
	</div>
	<div class="container">
		<div class="row">
			<div class="col-md-12">
				<%@include file="./common/header.jsp"%>
			</div>
		</div>
		<div class="row">
			<div class="col-md-12">
				<!--导航栏-->
				<nav class="navbar navbar-expand-lg navbar-dark bg-dark">

					<a class="navbar-brand" href="#">导航</a>
					<button class="navbar-toggler" type="button" data-toggle="collapse"
						data-target="#navbarSupportedContent"
						aria-controls="navbarSupportedContent" aria-expanded="false"
						aria-label="Toggle navigation">
						<span class="navbar-toggler-icon"></span>
					</button>

					<div class="collapse navbar-collapse" id="navbarSupportedContent">
						<ul class="navbar-nav mr-auto">
							<li class="nav-item "><a class="nav-link" href="#">首页 <span
									class="sr-only">(current)</span>
							</a></li>

							<li class="nav-item"><a class="nav-link" href="#">订单 <span
									class="sr-only">(current)</span>
							</a></li>

							<li class="nav-item active"><a class="nav-link " href="#">我的购物车
									<span class="sr-only">(current)</span>
							</a></li>

							<li class="nav-item dropdown"><a
								class="nav-link dropdown-toggle" href="#" id="navbarDropdown"
								role="button" data-toggle="dropdown" aria-haspopup="true"
								aria-expanded="false"> 我的空间 </a>
								<div class="dropdown-menu" aria-labelledby="navbarDropdown">
									<a class="dropdown-item" href="#">登陆</a> <a
										class="dropdown-item" href="#">注册</a> <a class="dropdown-item"
										href="#">地址管理</a> <a class="dropdown-item" href="#">评论区</a> <a
										class="dropdown-item" href="#">统计图</a>
								</div></li>

						</ul>
						<form class="form-inline my-2 my-lg-0" id="form" action="">
							<input class="form-control mr-sm-2" type="search"
								placeholder="请输入店家名称..." aria-label="Search">
							<button class="btn btn-outline-success my-2 my-sm-0"
								type="submit">搜索</button>
						</form>
					</div>
				</nav>
				<!--END导航栏-->
			</div>
		</div>
		<div class="row">
			<div class="col-md-12 text-center mt-3 h1">我的购物车</div>
		</div>


		<div class="row">
			<div class="col-md-2"></div>

			<div class="col-md-8">
				<!--列表-->
				<table class="table">

					<thead>
						<tr class="table-dark">
							<th scope="col">图片</th>
							<th scope="col">名称</th>
							<th scope="col">单价</th>
							<th scope="col" class="text-center">数量</th>
							<th scope="col">小计</th>
							<th scope="col">操作</th>
						</tr>
					</thead>
					<c:forEach var="buycar" items="${buycar}">
						<tbody id="infos">
							<tr style="text-align: center">
								<td><img src="${initParam.imgs_food}/${buycar.goodImg}" /></td>
								<td>${buycar.goodName}</td>
								<td>${buycar.goodPrice}</td>
								<%--${param.id}是商店ID --%>
								<td><a href="javascript:void(0)"><img
										onclick="cutnum(${buycar.id},${param.shopid})"
										src="/gll/img/minu.png" /></a> <span id="num${buycar.id}">${buycar.qty}</span>
									<a href="javascript:void(0)"><img
										onclick="addnum(${buycar.id},${param.shopid})"
										src="/gll/img/add.png" /></a></td>
								<td><span id="sum${buycar.sum}">${buycar.sum}</span></td>
								<td><a href="delete?shopcarId=${buycar.id}&id=${param.shopid}">
										<button type="button" class="btn btn-primary d">删除</button>
								</a></td>
							</tr>
						</tbody>
					</c:forEach>
				</table>
				<!--END列表-->
				<div class="d-flex flex-column justify-content-end text-right">
					<div id="yj">原价：￥0.00</div>
					<div id="yh">优惠：￥0.00</div>
					<div id="zj" class="zj">总计：￥0.00</div>
				</div>
			</div>

			<div class="col-md-2"></div>
		</div>
		<div class="row">
			<div class="col-md-12 d-flex justify-content-center">
				<a href="pay?id=">
					<button type="button" class="btn btn-primary">支付</button>
				</a>
			</div>
		</div>
	</div>
</body>
<!-- JavaScript 文件是可选的。从以下两种建议中选择一个即可！ -->

<!-- 选项 1：jQuery 和 Bootstrap 集成包（集成了 Popper） -->
<script src="js/jquery-3.2.1.min.js"></script>
<script src="js/bootstrap.bundle.min.js"></script>
<script>
function addnum(bid,sid){
	$.post("/gll/addnum",{'shopcarId':bid,'shopid':sid},
			function(d){
				$("#num"+bid).html(d.num);
				$("#sum"+bid).html(d.sum);
				$("#cost").html("原价：￥"+d.cost);
				$("#discount").html("优惠：￥"+d.discount);
				$("#discountprice").html("总计：￥"+d.discountprice);
	},"json");
}

function cutnum(bid,sid){
	$.post("/gll/cutnum" ,{'shopcarId':bid,'shopId':sid},
			function(d){
		$("#num"+bid).html(d.num);
		$("#sum"+bid).html(d.sum);
		$("#cost").html("原价：￥"+d.cost);
		$("#discount").html("优惠：￥"+d.discount);
		$("#discountprice").html("总计：￥"+d.discountprice);
	},"json");
}
</script>


</html>